body {
    width: 100%;
    min-width: 320px;
    max-width: 640px;
    margin: 0 auto;
    /* height: 2000px; */
    font-size: 14px;
    font-family: -apple-system, Helvetica, sans-serif;
    color: #666;
    line-height: 1.5;
}
/*点击高亮我们需要清除清除  设置为transparent 完成透明*/

* {
    -webkit-tap-highlight-color: transparent;
}


/*在移动端浏览器默认的外观在iOS上加上这个属性才能给按钮和输入框自定义样式*/

input {
    -webkit-appearance: none;
}


/*禁用长按页面时的弹出菜单*/

img,
a {
    -webkit-touch-callout: none;
}

a {
    color: #666;
    text-decoration: none;
}

ul,
li {
    margin: 0;
    padding: 0;
    list-style: none;
}

img {
    vertical-align: top;
}

div {
    /* css3 盒子模型 */
    box-sizing: border-box;
}
/* 清除浮动 */
.clearfix::before,
.clearfix::after {
	content: "";
	height: 0;
	line-height: 0;
	display: block;
	visibility: hidden;
}

.clearfix::after {
	clear: both;
}

/* 头部开始 */
header {
    position: fixed;
    width: 100%;
    height: 52px;
    min-width: 320px;
    max-width: 640px;
    background-color: #ff552e;
    z-index: 1;
}
header .logo {
    position: absolute;
    top: 15px;
    left: 15px;
    color: #fff;
    font-size: 14px;
    font-weight: 700;
}
header .logo::before {
    content: "";
    display: inline-block;
    width: 25px;
    height: 20px;
    background: url(../images/logo.png) no-repeat;
    background-size: 25px 20px;
    vertical-align: middle;
    margin: -2px 5px 0 0;
}
header .logo::after {
    content: "\ea52";
    display: inline-block;
    width: 19px;
    height: 17px;
    font-family: "icomoon";
    margin-left: 5px;
    cursor: pointer;
    transition: all .5s;
}
header .logo:hover::after {
    transform: rotate(-180deg);
}
header .sec {
    position: relative;
    height: 39px;
    background:rgba(255, 255, 255, .5);
    margin: 0 110px;
    margin-top: 6px;
    line-height: 39px;
    color: #fff;
    padding-left: 30px;
}
header .sec::before {
    content: "\e986";
    font-family: "icomoon";
    margin-right: 5px;
}
header .login {
    position: absolute;
    top: 15px;
    right: 15px;
    padding: 2px 2px;
    color: #fff;
    font-size: 14px;
    font-weight: 700; 
    /* background-color: pink; */
}
.login a {
    display: inline-block;
    color: #fff;
}
.login i {
    margin: 0 2px;
}
/* 头部结束 */
/* 导航开始 */
.ban {
    height: 220px;
    width: 100%;
    padding-top: 52px;
    background-color: #fff;
    text-align: center;

}
.ban ul {
    display: flex;
    flex-direction: row;
    flex-wrap: wrap;
    margin: 12px 0;
}
.ban li {
    flex: 20%;
}
.ban li a {
    display: inline-block;
    height: 75px;
    width: 74px;
    font-size: 12px;
}
.ban li a::before {
    content: "";
    width: 61px;
    height: 45px;
    display: inline-block;
    margin-left: 13px;
}
.ban li:nth-child(1) a:nth-child(1)::before {
    background: url(../images/f995d487cb932a4edd75ecc132ca4b6f.png) no-repeat;
    background-size: 45px 45px;
}
.ban li:nth-child(2) a:nth-child(1)::before {
    background: url(../images/n_v2958a4f511f574ac2be1fe32b41bfd0d7_21e9cf3f3e0d6735.png) no-repeat;
    background-size: 45px 45px;
}
.ban li:nth-child(4) a:nth-child(1)::before {
    background: url(../images/n_v2de9ab81fb22646b0846396405891274e_6d001cc87d7afe32.png) no-repeat;
    background-size: 45px 45px;
}
.ban li:nth-child(3) a:nth-child(1)::before {
    background: url(../images/n_v211534df072e1426f9d356f67278f5dc9_1ad41bd50e31bf85.png) no-repeat;
    background-size: 45px 45px;
}
.ban li:nth-child(5) a:nth-child(1)::before {
    background: url(../images/n_v241283e9bb8d24f3cb1eb5204151aba1c_a2f7640380e0ebc3.png) no-repeat;
    background-size: 45px 45px;
}
.ban li:nth-child(6) a:nth-child(1)::before {
    background: url(../images/n_v2ef9067b722fb46e6bfb4af2c8527b260_078386bf4aa2e80a.png) no-repeat;
    background-size: 45px 45px;
}
.ban li:nth-child(7) a:nth-child(1)::before {
    background: url(../images/n_v2157b80dc25b6416bbdf647991c99e091_ff4c63b7bbe1989c.png) no-repeat;
    background-size: 45px 45px;
}
.ban li:nth-child(8) a:nth-child(1)::before {
    background: url(../images/n_v234fa519cb0f14c589169bcf516b8b079_8372bd1437cd7317.png) no-repeat;
    background-size: 45px 45px;
}
.ban li:nth-child(9) a:nth-child(1)::before {
    background: url(../images/n_v2fbab6df18deb44a8aedc6ddf8e891d94_1e3316460aac59c6.png) no-repeat;
    background-size: 45px 45px;
}
.ban li:nth-child(10) a:nth-child(1)::before {
    background: url(../images/n_v2c12da6cc9ce7456ba2eb6879b1b42c3e_61e4fb2acd8274a0.png) no-repeat;
    background-size: 45px 45px;
}
/* 导航结束 */
/* 租房开始 */
.zhu {
    width: 100%;
    background-color: #fff;
    margin-top: 10px;
    overflow: hidden;
}
.zhu h3 {
    position: relative;
    width: 100%;
    height: 50px;
    line-height: 50px;
    color: #ccc;
    padding: 0 4px;
}
.zhu h3::after {
    position: absolute;
    top: 0;
    right: 5px;
    content: "\ea1c";
    display: inline-block;
    width: 20px;
    height: 45px;
    font-family: "icomoon";
    font-size: 12px;
}
.zhupin {
    display: flex;
    border-top: 1px solid #ccc;
    border-bottom: 1px solid #ccc;
    overflow: hidden;
}
.zhupin div {
    flex: 1;
    height: 100px;
    /* background-color: rgb(224, 165, 165); */
    text-align: center;
}
.zhupin div h4 {
    margin-top: 10px;
    font-size: 12px;
}
.zhupin div p {
    font-size: 9px;
    text-align: center;
}
.zhupin div {
    display: flex;
    flex-direction: column;  
}
.zhupin div:nth-child(1) p::before {
    content: "";
    width: 58px;
    height: 45px;
    display: block;
    background: url(../images/2b76c1916af0613411a10ed7a0e5fb29.png) no-repeat;
    background-size: 60px;
    margin: 5px auto;
}
.zhupin div:nth-child(2) p::before {
    content: "";
    width: 68px;
    height: 47.5px;
    display: block;
    background: url(../images/c7e775e412506b73f29415f202a2b1dc.png) no-repeat;
    background-size: 68px;
    margin: 5px auto;
}
.zhupin div:nth-child(3) p::before {
    content: "";
    width: 77px;
    height: 47.5px;
    display: block;
    background: url(../images/6347a185bd5bf7203ff20656ff099034.png) no-repeat;
    background-size: 68px;
    margin: 5px auto;
}
.zhupin div:nth-child(2) {
   border-left: 1px solid #ccc;
   border-right: 1px solid #ccc;
}
.fenlei {
    overflow: hidden;
}
.fenlei ul {    
    display: flex;
    flex-direction: row;
    flex-wrap: wrap; 
    /* 盒子可以比父级大 */
    width: 103%;
}
.fenlei li {
    flex: 1;   
    min-width: 24%;
    max-width: 24%;
    height: 37px;
    text-align: center;
    line-height: 37px;
    background-color: rgb(228, 225, 225);
    color: rgb(99, 94, 94);
    margin: 5px 1px;
}
.fenlei li:hover {
    color: #ff552e;
}
/* 租房结束 */
/* 猜你兴趣 开始 */
.cai {
    width: 100%;
    line-height: 47px;
    text-align: center;
    font-size: 14px;
    color: rgb(138, 134, 134);
    background-color: #f6f6f6;
}
.cai_fen {
    margin-top: 10px;
    cursor: pointer;
}
.cai_xaing {
    height: 67px;
}
.cai_fen ul {
    display: flex;
    flex-direction: row;
    line-height: 50px;
    height: 50px;
    border-bottom: 2px solid #ff552e;
    justify-content: space-around;
    color: rgb(180, 178, 178);
}
.cai_fen ul li {
    position: relative;
    font-weight: 700;
    /* background-color: rgb(61, 36, 36); */
}
.cai_fen ul li:nth-child(1) {
    color: #fe5832;
}
.cai_fen ul li:nth-child(1)::after {
    position: absolute;
    top: 22px;
    left: 40%;
    transform: translateX(-50%);
    content: "\ea1c";
    font-family: "icomoon";
    transform: rotate(-90deg);
    color: #fe5832;
    font-size: 12px;
    /* background-color: #fff; */
}
.cai_fen ul li:hover::after {
    position: absolute;
    top: 22px;
    left: 40%;
    transform: translateX(-50%);
    content: "\ea1c";
    font-family: "icomoon";
    transform: rotate(-90deg);
    color: #fe5832;
    font-size: 12px;
    /* background-color: #fff; */
}
.cai_fen ul li:hover {
    color: #fe5832;
}
.cai_xaing {
    height: 70px;
    /* background-color: pink; */
    margin-top: 19px;
}
.cai_xaing .photo {
    float: left;
    width: 90px;
    height: 70px;
}
.cai_xaing .photo img {
    width: 100%;
    height: 100%;
}
.dizhi {
    float: left;
    width:128px;
    height: 70px;
    line-height: 18px;
    font-size: 8px;
    margin-left: 20px;
} 
.jiage {
    float: right;
    text-align: right;
    margin-right: 10px;
}
.jiage p:nth-child(1) {
    font-size: 15px;
    color: #000;
}
.jiage p:nth-child(2) {
    font-size: 20px;
    color: rgb(255, 0, 0);
    margin-top: 10px;
}
/* 加载更多 */
.jiazai {
    clear: both;
    width: 100%;
    height: 47px;
    line-height: 47px;
    text-align: center;
    font-size: 14px;
    color: rgb(138, 134, 134);
    background-color: #f6f6f6;
    cursor: pointer;
    margin-top: 10px;   
}
.yingyong {
    width: 100%;
    height: 100px; 
    background-color: #fff;
    text-align: center;
    margin-top: 15px;
}
.yingyong ul {
    display: flex;
    animation-direction: row;
}
.yingyong li {
    flex: 20%;
}
.yingyong li::before {
    content:"";
    display:block;
    width: 35px;
    height: 35px;
    line-height: 35px;
    border: 1px solid #ccc;
    border-radius: 50%;
    font-family: "icomoon";
    margin: 0 auto 8px;
}
.yingyong li:nth-child(1)::before {
    content: "\e959";
}
.yingyong li:nth-child(2)::before {
    content: "\e959";
}
.yingyong li:nth-child(2) {
    color: #000;
}
.yingyong li:nth-child(2)::before {
    border:1px solid #000;
}
.yingyong li:nth-child(3)::before {
    content: "\e957";
}
.yingyong li:nth-child(4)::before {
    content: "\e957";
}
.yingyong li:nth-child(5)::before {
    content: "\e970";
}
